<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
	<meta charset="UTF-8">
	<title>图书详情</title>
	<link rel="stylesheet" type="text/css"  href="dist/css/bootstrap.min.css" th:href="@{/dist/css/bootstrap.min.css}">
	<link rel="stylesheet" type="text/css" href="css/index.css" th:href="@{/css/index.css}" />
	<link rel="stylesheet" type="text/css" href="css/animate.css" th:href="@{/css/animate.css}" />
</head>

<body>
<!--导航部分  begin-->
<div th:replace="common/header :: header"></div>
<!--导航部分 end-->

<!--最顶端轮播图片 begin-->
<div th:replace="common/carousel :: carousel"></div>
<!--最顶端轮播图片 end-->

<!--外层div-->
<div class="container" >
	<!--左边-->
	<div th:if="${session.adamin != null}" >
		<ol class="breadcrumb">
			<li>
				<a href="#">图书详情</a>
			</li>
			<li>
				<a href="#" th:text="${book.name}">愿你的青春不负梦想</a>
			</li>
		</ol>

		<div class="row">
			<div class="col-sm-12 col-md-6">
				<div class="thumbnail">
					<a><img src="images/yuannideqingchunbufumengxiang.jpg" th:src="@{'/public/' + ${book.imgUrl}}" style="height: 200px;" alt="通用的占位符缩略图"></a>
					<div class="caption">
						<h3 th:text="${book.name}">愿你的青春不负梦想</h3>
						<p>双十一特价,包邮哟!亲<img src="images/3.gif" th:src="@{/images/3.gif}" style="width: 24px;height: 24px;"></p>
						<p>
						<div style="margin-bottom: 5px;width: 100px;" th:if="${session.adamin == null}">
							<input type="number" id="bookCount" class="form-control" placeholder="购买数量" min="1" max="100" onclick="selectByCount(this)">
						</div>
						<div style="clear: both;" th:if="${session.adamin == null}">
							<a href="javascript:void(0)" th:onclick="addCart([[${book.id}]])" class="btn btn-default" role="button">
								<span class="glyphicon glyphicon-shopping-cart"></span> 加入购物车
							</a>
						</div>
						<td th:if="${session.adamin != null}"><button class="btn btn-danger" data-toggle="modal" data-target="#myModal" onclick="del()" th:onclick="deletebook([[${book.id}]])">删除图书</button></td>
						<td th:if="${session.adamin != null}">
							<a href="#" class="btn btn-warning" data-toggle="modal" data-target="#updateModal">修改图书信息</a>
						</td>
						</p>
					</div>
				</div>
			</div>
			<!--添加图书模态框 -->

			<!--修改信息模态框-->
			<div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="updateModalLabel" aria-hidden="true">
				<div class="modal-dialog">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
								&times;
							</button>
							<h4 class="modal-title" id="updateModalLabel">
								修改图书信息
							</h4>
						</div>
						<div class="modal-body">
							<!--登录的form表单-->
							<form id="updateForm" action="" class="form-horizontal" role="form">
								<div class="form-group has-feedback">
									<label class="col-sm-2 control-label">作者</label>
									<div class="col-sm-5">
										<input type="text" id="author" name="author" class="form-control" th:value="${book.author}" placeholder="请输入作者">
									</div>
								</div>
									<input type="hidden"  id="id" name="id" class="form-control"  th:value="${book.id}">
								<div class="form-group has-feedback">
									<label class="col-sm-2 control-label">出版社</label>
									<div class="col-sm-5">
										<input type="text" id="publisher" name="publisher" class="form-control" th:value="${book.publisher}" placeholder="请输入出版社">
									</div>
								</div>

								<div class="form-group has-feedback">
									<label class="col-sm-2 control-label">原价</label>
									<div class="col-sm-5">
										<input type="text" id="oldPrice" name="oldPrice" class="form-control" th:value="(${book.newPrice})" placeholder="请输入原价">
									</div>
								</div>

								<div class="form-group has-feedback">
									<label class="col-sm-2 control-label">现价</label>
									<div class="col-sm-5">
										<input type="text" id="newPrice" name="newPrice" class="form-control"  th:value="(${book.oldPrice})" placeholder="请输入现价">

									</div>
								</div>

								<div class="form-group has-feedback">
									<label class="col-sm-2 control-label">说明</label>
									<div class="col-sm-5">
										<input type="text" id="info" name="info" class="form-control" th:value="${book.info}" placeholder="请输入说明">

									</div>
								</div>

								<!--<div class="form-group has-feedback">
                                    <label class="col-sm-2 control-label">地址</label>
                                    <div class="col-sm-5">
                                        <input type="text" class="form-control" placeholder="请输入收货">
                                        <span class="glyphicon glyphicon-home form-control-feedback"></span>
                                    </div>
                                </div>-->

								<div class="modal-footer">
									<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
									<input type="button" class="btn btn-primary" value="修改" th:onclick="|update([[${book.id}]])|">
								</div>
							</form>
							<!--form结束-->
						</div>
					</div>
					<!-- /.modal-content -->
				</div>
			</div>





			<div class="col-sm-12 col-md-6">
				<div class="thumbnail">
					<ul class="list-group">
						<li class="list-group-item"><span class="text-success">图书名称:<span th:text="${book.name}">愿你的青春不负梦想</span></span></li>
						<li class="list-group-item"><span class="text-info">作者:</span><span th:text="${book.author}">俞敏洪</span></li>
						<li class="list-group-item"><span class="text-info">出版日期:</span><span th:text="${#dates.format(book.publishDate,'yyyy年MM月')}">2017年01月</span></li>
						<li class="list-group-item"><span class="text-info">出版社:</span><span th:text="${book.publisher}">湖南文艺出版社</span></li>
						<li class="list-group-item"><span class="text-info" style="text-decoration: line-through;">原价:</span><span style="text-decoration: line-through;" th:text="${'$' + book.oldPrice + '元'}">$36元</span></li>
						<li class="list-group-item"><span class="text-info">现价:</span><span th:text="${'$' + book.newPrice + '元'}">$21.6元</span></li>
						<li class="list-group-item"><span class="text-info">说明:</span> <span th:text="${book.info}">50年心路历程×25年创业思考×80场演讲精华，与不甘平庸的你，谈谈如何度过不悔的青春，实现你心中的梦想。</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<!--<hr>-->
		<!--折叠部分 begin-->
		<div class="panel panel-default">
			<div class="panel-heading">
				<h4 class="panel-title">
					<a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
						展开详细信息
					</a>
				</h4>
			</div>
			<div id="collapseTwo" class="panel-collapse collapse">
				<div class="panel-body">
					<!--tab选项卡 begin-->
					<ul id="myTab" class="nav nav-tabs">
						<li class="active">
							<a href="#home" data-toggle="tab">
								商品详情
							</a>
						</li>
						<li>
							<a href="#ios" data-toggle="tab"> <span class="badge pull-right">50</span>累计评价</a>
						</li>
					</ul>
					<div id="myTabContent" class="tab-content">
						<div class="tab-pane fade in active" id="home">
							<p>
								<em>产品参数：</em>
							</p>
							<div class="row">
								<div class="col-sm-12 col-md-6">
									<ul class="nav navbar-collapse" style="line-height: 3;">
										<li class="text-info">产品名称：<span th:text="${book.name}">愿你的青春不负梦想</span></li>
										<li class="text-info">书名:<span th:text="${book.name}">愿你的青春不负梦想</span></li>
										<li class="text-info">定价: <span th:text="${book.oldPrice + '元'}">36.00元</span></li>
										<li class="text-info">出版社名称: <span th:text="${book.publisher}">湖南文艺出版社</span></li>
										<li class="text-info">作者: <span th:text="${book.author}">俞敏洪</span></li>
										<li class="text-info">作者地区: <span th:text="${book.authorLoc}">中国</span></li>
										<li class="text-info">ISBN编号: <span th:text="${book.isbn}">9787540478612</span></li>
									</ul>
								</div>
								<span class="visible-sm visible-xs"><hr></span>

							</div>
							</p>
						</div>
						<div class="tab-pane fade" id="ios">
							<p>
							<ul class="list-group">
								<li class="list-group-item"><span class="text-info">小明:</span><span class="text-success ">这真的是一本好书<img src="images/emotions/1.gif " th:src="@{/images/emotions/1.gif}"></span></li>
								<li class="list-group-item"><span class="text-info">success:</span><span class="text-danger ">书的质量很差<img src="images/emotions/2.gif " th:src="@{/images/emotions/2.gif}"></span></li>
								<li class="list-group-item"><span class="text-info">叶老师:</span><span class="text-success ">很值得初学者学习<img src="images/emotions/13.gif " th:src="@{/images/emotions/13.gif}"></span></li>
								<li class="list-group-item"><span class="text-info">amdin:</span><span class="text-danger ">被坑大发了.<img src="images/emotions/17.gif " th:src="@{/images/emotions/17.gif}"></span></li>
								<li class="list-group-item"><span class="text-info">rose:</span><span class="text-danger ">卖家态度恶劣.<img src="images/emotions/11.gif " th:src="@{/images/emotions/11.gif}"></span></li>
							</ul>
							</p>

						</div>
					</div>
					<!--tab选项卡 end-->
				</div>
			</div>
		</div>
		<!--折叠部分end-->
	</div>
</div>
	<div class="container" th:if="${session.adamin == null}">
		<!--左边-->
		<div class="col-md-8 col-sm-12">
			<ol class="breadcrumb">
				<li>
					<a href="#">图书详情</a>
				</li>
				<li>
					<a href="#" th:text="${book.name}">愿你的青春不负梦想</a>
				</li>
			</ol>

			<div class="row">
				<div class="col-sm-12 col-md-6">
					<div class="thumbnail">
						<a><img src="images/yuannideqingchunbufumengxiang.jpg" th:src="@{'/public/' + ${book.imgUrl}}" style="height: 200px;" alt="通用的占位符缩略图"></a>
						<div class="caption">
							<h3 th:text="${book.name}">愿你的青春不负梦想</h3>
							<p>双十一特价,包邮哟!亲<img src="images/3.gif" th:src="@{/images/3.gif}" style="width: 24px;height: 24px;"></p>
							<p>
							<div style="margin-bottom: 5px;width: 100px;" th:if="${session.adamin == null}">
								<input type="number" id="bookCount" class="form-control" placeholder="购买数量" min="1" max="100" onclick="selectByCount(this)">
							</div>
							<div style="clear: both;" th:if="${session.adamin == null}">
								<a href="javascript:void(0)" th:onclick="addCart([[${book.id}]])" class="btn btn-default" role="button">
									<span class="glyphicon glyphicon-shopping-cart"></span> 加入购物车
								</a>
							</div>
							<td th:if="${session.adamin != null}"><button class="btn btn-danger" data-toggle="modal" data-target="#myModal" onclick="del()" th:onclick="deletebook([[${book.id}]])">删除图书</button></td>
							<td th:if="${session.adamin != null}">
								<a href="#" class="btn btn-warning" data-toggle="modal" data-target="#updateModal">修改图书信息</a>
							</td>
							</p>
						</div>
					</div>
				</div>
				<!--添加图书模态框 -->

				<!--修改信息模态框-->
				<div class="modal fade" id="updateModal" tabindex="-1" role="dialog" aria-labelledby="updateModalLabel" aria-hidden="true">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
									&times;
								</button>
								<h4 class="modal-title" id="updateModalLabel">
									修改图书信息
								</h4>
							</div>
							<div class="modal-body">
								<!--登录的form表单-->
								<form id="updateForm" action="" class="form-horizontal" role="form">
									<div class="form-group has-feedback">
										<label class="col-sm-2 control-label">作者</label>
										<div class="col-sm-5">
											<input type="text" id="author" name="author" class="form-control" th:value="${book.author}">
										</div>
									</div>
									<input type="hidden"  id="id" name="id" class="form-control"  th:value="${book.id}">
									<div class="form-group has-feedback">
										<label class="col-sm-2 control-label">出版社</label>
										<div class="col-sm-5">
											<input type="text" id="publisher" name="publisher" class="form-control" th:value="${book.publisher}" placeholder="请输入公司地址">
										</div>
									</div>

									<div class="form-group has-feedback">
										<label class="col-sm-2 control-label">原价</label>
										<div class="col-sm-5">
											<input type="text" id="oldPrice" name="oldPrice" class="form-control" th:value="(${book.newPrice})">
										</div>
									</div>

									<div class="form-group has-feedback">
										<label class="col-sm-2 control-label">现价</label>
										<div class="col-sm-5">
											<input type="text" id="newPrice" name="newPrice" class="form-control"  th:value="(${book.oldPrice})">

										</div>
									</div>

									<div class="form-group has-feedback">
										<label class="col-sm-2 control-label">说明</label>
										<div class="col-sm-5">
											<input type="text" id="info" name="info" class="form-control" th:value="${book.info}" placeholder="请输入公司地址">

										</div>
									</div>

									<!--<div class="form-group has-feedback">
                                        <label class="col-sm-2 control-label">地址</label>
                                        <div class="col-sm-5">
                                            <input type="text" class="form-control" placeholder="请输入收货">
                                            <span class="glyphicon glyphicon-home form-control-feedback"></span>
                                        </div>
                                    </div>-->

									<div class="modal-footer">
										<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
										<input type="button" class="btn btn-primary" value="修改" th:onclick="|update([[${book.id}]])|">
									</div>
								</form>
								<!--form结束-->
							</div>
						</div>
						<!-- /.modal-content -->
					</div>
				</div>





				<div class="col-sm-12 col-md-6">
					<div class="thumbnail">
						<ul class="list-group">
							<li class="list-group-item"><span class="text-success">图书名称:<span th:text="${book.name}">愿你的青春不负梦想</span></span></li>
							<li class="list-group-item"><span class="text-info">作者:</span><span th:text="${book.author}">俞敏洪</span></li>
							<li class="list-group-item"><span class="text-info">出版日期:</span><span th:text="${#dates.format(book.publishDate,'yyyy年MM月')}">2017年01月</span></li>
							<li class="list-group-item"><span class="text-info">出版社:</span><span th:text="${book.publisher}">湖南文艺出版社</span></li>
							<li class="list-group-item"><span class="text-info" style="text-decoration: line-through;">原价:</span><span style="text-decoration: line-through;" th:text="${'$' + book.oldPrice + '元'}">$36元</span></li>
							<li class="list-group-item"><span class="text-info">现价:</span><span th:text="${'$' + book.newPrice + '元'}">$21.6元</span></li>
							<li class="list-group-item"><span class="text-info">说明:</span> <span th:text="${book.info}">50年心路历程×25年创业思考×80场演讲精华，与不甘平庸的你，谈谈如何度过不悔的青春，实现你心中的梦想。</span>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<!--<hr>-->
			<!--折叠部分 begin-->
			<div class="panel panel-default">
				<div class="panel-heading">
					<h4 class="panel-title">
						<a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
							展开详细信息
						</a>
					</h4>
				</div>
				<div id="collapseTwo" class="panel-collapse collapse">
					<div class="panel-body">
						<!--tab选项卡 begin-->
						<ul id="myTab" class="nav nav-tabs">
							<li class="active">
								<a href="#home" data-toggle="tab">
									商品详情
								</a>
							</li>
							<li>
								<a href="#ios" data-toggle="tab"> <span class="badge pull-right">50</span>累计评价</a>
							</li>
						</ul>
						<div id="myTabContent" class="tab-content">
							<div class="tab-pane fade in active" id="home">
								<p>
									<em>产品参数：</em>
								</p>
								<div class="row">
									<div class="col-sm-12 col-md-6">
										<ul class="nav navbar-collapse" style="line-height: 3;">
											<li class="text-info">产品名称：<span th:text="${book.name}">愿你的青春不负梦想</span></li>
											<li class="text-info">书名:<span th:text="${book.name}">愿你的青春不负梦想</span></li>
											<li class="text-info">定价: <span th:text="${book.oldPrice + '元'}">36.00元</span></li>
											<li class="text-info">出版社名称: <span th:text="${book.publisher}">湖南文艺出版社</span></li>
											<li class="text-info">作者: <span th:text="${book.author}">俞敏洪</span></li>
											<li class="text-info">作者地区: <span th:text="${book.authorLoc}">中国</span></li>
											<li class="text-info">ISBN编号: <span th:text="${book.isbn}">9787540478612</span></li>
										</ul>
									</div>
									<span class="visible-sm visible-xs"><hr></span>

								</div>
								</p>
							</div>
							<div class="tab-pane fade" id="ios">
								<p>
								<ul class="list-group">
									<li class="list-group-item"><span class="text-info">小明:</span><span class="text-success ">这真的是一本好书<img src="images/emotions/1.gif " th:src="@{/images/emotions/1.gif}"></span></li>
									<li class="list-group-item"><span class="text-info">success:</span><span class="text-danger ">书的质量很差<img src="images/emotions/2.gif " th:src="@{/images/emotions/2.gif}"></span></li>
									<li class="list-group-item"><span class="text-info">叶老师:</span><span class="text-success ">很值得初学者学习<img src="images/emotions/13.gif " th:src="@{/images/emotions/13.gif}"></span></li>
									<li class="list-group-item"><span class="text-info">amdin:</span><span class="text-danger ">被坑大发了.<img src="images/emotions/17.gif " th:src="@{/images/emotions/17.gif}"></span></li>
									<li class="list-group-item"><span class="text-info">rose:</span><span class="text-danger ">卖家态度恶劣.<img src="images/emotions/11.gif " th:src="@{/images/emotions/11.gif}"></span></li>
								</ul>
								</p>

							</div>
						</div>
						<!--tab选项卡 end-->
					</div>
				</div>
			</div>
			<!--折叠部分end-->
		</div>


		<!--右边-->
	<div class="col-md-4 col-sm-3 col-xs-8" >
		<!--猜您喜欢-->
		<div>
			<span class="text-info"><span class="glyphicon glyphicon-heart"></span><span style="font-size: 20px; ">猜您喜欢</span></span>
			<div class="row" id="love">
				<div class="col-sm-12 col-md-12 wow fadeInRight animated">
					<div class="thumbnail">
						<a href="details.html" th:href="@{/book/detail(id=11)}"><img src="images/xiaodaolifencunzhijian.jpg " th:src="@{/images/xiaodaolifencunzhijian.jpg}" style="height: 200px; " alt="通用的占位符缩略图 "></a>
						<div class="caption ">
							<h3>小道理：分寸之间</h3>
						</div>
					</div>
				</div>
				<div class="col-sm-12 col-md-12 wow fadeInRight animated">
					<div class="thumbnail ">
						<a href="details.html" th:href="@{/book/detail(id=12)}"><img src="images/NO SECRETS.jpg " th:src="@{/images/NO SECRETS.jpg}" style="height: 200px; " alt="通用的占位符缩略图 "></a>
						<div class="caption ">
							<h3>名创优品没有秘密</h3>
						</div>
					</div>
				</div>
				<div class="col-sm-12 col-md-12 wow fadeInRight animated">
					<div class="thumbnail ">
						<a href="details.html" th:href="@{/book/detail(id=19)}"><img src="images/maichanpinjiushimaiziji.jpg" th:src="@{/images/maichanpinjiushimaiziji.jpg}" style="height: 200px; " alt="通用的占位符缩略图 "></a>
						<div class="caption ">
							<h3>卖产品就是卖自己</h3>
						</div>
					</div>
				</div>

			</div>
		</div>
	</div>
</div>


<!--首页底部信息 begin-->
<div th:replace="common/footer :: footer"></div>

<!--登录注册模态框-->
<div th:replace="common/bookModal :: bookModal"></div>

<script src="dist/js/jquery.min.js" th:src="@{/dist/js/jquery.min.js}"></script>
<script src="js/carousel.js" th:src="@{/js/carousel.js}" type="text/javascript" charset="utf-8"></script>
<script src="dist/js/bootstrap.min.js" th:src="@{/dist/js/bootstrap.min.js}"></script>
<script src="js/wow.js" th:src="@{/js/wow.js}"></script>
<script src="js/cha/js" th:src="@{/js/cha.js}"></script>
<script src="js/details.js" th:src="@{/js/details.js}" type="text/javascript" charset="utf-8"></script>
<script th:src="@{/js/login_reg.js}"></script>
<script th:inline="javascript">
	var contextPath = [[${#request.getContextPath()}]];
	var user = [[${session.user}]];
</script>
<script type="text/javascript">
	if(!(/msie [6|7|8|9]/i.test(navigator.userAgent))) {
		new WOW().init();
	};

	//进入支付页面
	function addOrder(bookId) {
		ids = bookId;
		var bookNum = $("#bookCount").val();
		if (bookNum == " " || bookNum == "undefind"){
			alert("请输入购买数量！");
			return;
		}
		if (user == " " || user == null){
			alert("请先登录！");
			return;
		}
		if(bookNum == 0) {
			alert('请选择购买数量！');
		} else {
			window.location.href = contextPath + '/order/confirm?ids=' + ids;
		}
	}

	//进入购物车
	function addCart(bookId) {
		//验证购买图书数量
		var bookNum = $("#bookCount").val();
		if(bookNum == '' || bookNum == 'undefined'){
			alert("请输入购买数量！");
			return;
		}
		//验证用户是否已经登录
		if(user == '' || user == null){
			alert("请先登录！");
			return;
		}

		//加入购物车
		$.ajax({
			url: contextPath + "/cart/add",
			data:{'count' : bookNum,'bookId' : bookId},
			method:"post",
			success:function (data) {
				if(data == 'success'){
					//跳转到购物车列表
					window.location.href = contextPath + "/cart/list";
				}
			}
		})
	}
    //删除图书
	function deletebook(bookId) {
		alert("请确认是否删除此图书")
		 $.ajax({
			 url: contextPath + "/book/delete",
			 data:{'bookId' : bookId},
			 method:"post",
			 success:function (data) {
				 if(data == "success"){
					 //跳转到购物车列表
					 alert("图书删除成功！")
					 window.location.href = contextPath + "/book/index";
				 }
			 }
		 })


	}
	//更新图书信息
	function update(bookId) {
		var id = bookId;
		var datas = $("#updateForm").serialize();
		$.ajax({
			url: contextPath + "/book/update",
			data: datas,
			method:"post",
			success:function (data) {
				if(data != null){
					alert(datas)
					alert("修改成功！点此返回");
					$("#register").modal('hide');
					window.location.href = contextPath + "/book/detail?id=" + id;
				}
			}
		})
	}




</script>
</body>
</html>